<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>出差补助单</title>
    <link rel="stylesheet" href="../../../css/aui.css" />
    <link rel="stylesheet" href="../../../css/my/apply.css"/>
    <script src="../../../script/widget/include.js"></script>
    <link rel="stylesheet" href="../../../css/trip/apply/date.css">
    <link rel="stylesheet" href="../../../css/iconfont/iconfont.css"/>
	<link rel="stylesheet" href="../../../script/widget/mobiscroll/mobiscroll.custom-3.0.0-beta6.min.css" />
	<link rel="stylesheet" href="../../../script/widget/Zepto/dropload.css"/>
	<style>
		.dropload-down{height: 0;}
	</style>
</head>
<body style="cursor: pointer">
	<ul class="aui-list aui-form-list" style="margin-bottom: 1rem;">
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-label"> 订单类型 </div>
				<div class="aui-list-item-input">
					<select id="order_type">
						<option value="0">全部</option>
						<option value="1">机票</option>
						<option value="3">酒店</option>
						<option value="5">火车</option>
					</select>
				</div>
			</div>
		</li>
        <li class="aui-list-item">
            <div class="aui-list-item-inner date-starttime">
                <div class="aui-list-item-label"> 开始时间 </div>
                <div class="aui-list-item-input">
                    <input type="text" placeholder="请选择时间" id="start_time" disabled>
                </div>
            </div>
        </li>
        <li class="aui-list-item">
            <div class="aui-list-item-inner date-endtime">
                <div class="aui-list-item-label"> 结束时间 </div>
                <div class="aui-list-item-input">
                    <input type="text" placeholder="请选择时间" id="end_time" disabled>
                </div>
            </div>
        </li>

		<li class="aui-list-item">
			<div class="aui-list-item-inner aui-list-item-center aui-list-item-btn">
				<div class="aui-btn aui-btn-info aui-btn-block aui-btn-sm" onclick="getDataList()" style="background-color: #3CB0D6 !important;">查询</div>
			</div>
		</li>
	</ul>


<div id="order_list" style="display: block;">
</div>


</body>
</html>
<script type="text/javascript" src="../../../script/common.js"></script>
<script type="text/javascript" src="../../../script/config.js"></script>
<script type="text/javascript" src="../../../script/aui/api.js"></script>
<script type="text/javascript" src="../../../script/aui/aui-toast.js"></script>
<script type="text/javascript" src="../../../script/extend/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="../../../script/extend/doT.min.js"></script>
<script type="text/javascript" src="../../../script/widget/Zepto/dropload.min.js"></script>
<script type="text/javascript" src="../../../script/widget/mobiscroll/mobiscroll.custom-3.0.0-beta6.min.js" ></script>
<!--列表模板 start-->
<script id="list_tpl" type="text/x-dot-template">
    {{ for(var prop in it) { }}

	{{ if (it[prop]['product_id'] == 1 ) { }}
	<ul class="aui-list aui-list-in" style="margin-bottom: 0.5rem;">
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title" style="font-size: 0.8rem;">订单号:{{= it[prop]['user_orderid'] }}</div>
				<div class="aui-list-item-right" style="font-size: 0.7rem;" onclick="confirmChoose()">
        <input type="checkbox" class="aui-checkbox" value="{{= it[prop]['order_id'] }}"></div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					{{= it[prop]['take_off_time'] }} <div class="aui-label aui-label-primary">{{= it[prop]['take_off_place'] }}</div>
					→ <div class="aui-label aui-label-primary">{{= it[prop]['to_ground_place']}}</div> {{= it[prop]['to_ground_time'] }}
				</div>
				<div class="aui-list-item-right">
					{{= it[prop]['take_off_date'] }}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					<div class="aui-label aui-label-success">机票</div>
					<div class="aui-label aui-label-warning">￥{{= it[prop]['order_total_price'] }}</div>
				</div>
				<div class="aui-list-item-right">
					<div class="aui-label aui-label-success">{{= it[prop]['shipping_space'] }}</div>
					{{= it[prop]['flight_number'] }}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">提交时间</div>
				<div class="aui-list-item-right">{{= it[prop]['create_time'] }}</div>
			</div>
		</li>
	</ul>
	{{ }else if (it[prop]['product_id'] == 3 ) { }}
	<ul class="aui-list aui-list-in" style="margin-bottom: 0.5rem;">
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title" style="font-size: 0.8rem;">订单号:{{= it[prop]['user_orderid'] }}</div>
				<div class="aui-list-item-right" style="font-size: 0.7rem;" onclick="confirmChoose()">
        <input type="checkbox" class="aui-checkbox" value="{{= it[prop]['order_id'] }}">
        </div>
			</div>
		</li>


		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					<div class="aui-label aui-label-primary">{{= it[prop]['room_type_name']}}</div>
					<div class="aui-label aui-label-primary">{{= it[prop]['trip_user_count']}}间</div>
				</div>
				<div class="aui-list-item-right">
					{{= it[prop]['arrival_time'] }}-{{= it[prop]['departure_time']}}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					<div class="aui-label aui-label-success">酒店</div>
					<div class="aui-label aui-label-warning">￥{{= it[prop]['order_total_price'] }}</div>
				</div>
				<div class="aui-list-item-right">
					{{= it[prop]['hotel_name'] }}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">提交时间</div>
				<div class="aui-list-item-right">{{= it[prop]['create_time'] }}</div>
			</div>
		</li>
	</ul>
	{{ }else if (it[prop]['product_id'] == 5 ) { }}
	<ul class="aui-list aui-list-in" style="margin-bottom: 0.5rem;">
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title" style="font-size: 0.8rem;">订单号:{{= it[prop]['user_orderid'] }}</div>
				<div class="aui-list-item-right" style="font-size: 0.7rem;" onclick="confirmChoose()">
        <input type="checkbox" class="aui-checkbox" value="{{= it[prop]['order_id'] }}">
        </div>
			</div>
		</li>


		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					{{= it[prop]['train_start_time'] }} <div class="aui-label aui-label-primary">{{= it[prop]['from_station_name'] }}</div>
					→ <div class="aui-label aui-label-primary">{{= it[prop]['to_station_name']}}</div> {{= it[prop]['train_end_time']}}
				</div>
				<div class="aui-list-item-right">
					{{= it[prop]['train_date'] }}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">
					<div class="aui-label aui-label-success">火车票</div>
					<div class="aui-label aui-label-warning">￥{{= it[prop]['order_total_price'] }}</div>
				</div>
				<div class="aui-list-item-right">
				<div class="aui-label aui-label-success">{{= it[prop]['train_seat_type'] }}</div>
					{{= it[prop]['train_code'] }}
				</div>
			</div>
		</li>
		<li class="aui-list-item">
			<div class="aui-list-item-inner">
				<div class="aui-list-item-title">提交时间</div>
				<div class="aui-list-item-right">{{= it[prop]['create_time']}}</div>
			</div>
		</li>
	</ul>
	{{ } }}

    {{ } }}
</script>
<!--列表模板 end-->
<script type="text/javascript">

	var toast = new auiToast();

	function getDataList(){
		$("#order_list").text('');
		//当前页数
		var page=0;
		var page_size=10;
		var page_max=0;
		$('#order_list').dropload({
			scrollArea : window,
			domDown: {
				domNoData: '<div class="dropload-noData">已经到底了</div>',
				domRefresh : ''
			},
			loadDownFn : function(me){
				if(page > page_max){
					me.lock();
					me.noData();
					me.resetload();
					return false;
				}
				++page;
				//获取提交数据
				var order_type = $("#order_type").val();
				var start_time = $("#start_time").val();
				var end_time = $("#end_time").val();

				var param = {};
				param.url = Config.travel.getOrderListAllowance;
				param.data = {page: page, limit: page_size, start_time: start_time, end_time: end_time, product_id: order_type};
				// console.log(param);
				ajax(param,function(ret){
					// console.log(ret);
					if(ret.code == 1){
						if(ret.data.data.length > 0){
							//插入模板
							var interText = doT.template($("#list_tpl").text());
							$("#order_list").append(interText(ret.data.data));
							page = ret.data.current_page;
							page_max = parseInt(ret.data.last_page);
						}else	{
							me.lock();
							me.noData();
						}
						me.resetload();
					} else {
						toast.custom({
							title:"获取订单失败",
							html:'<i class="aui-iconfont aui-icon-info"></i>',
							duration:2000
						});
						me.resetload();
					}
				})
			}
		});
	}

	function confirmChoose(){
		var orderids = '';
		$(".aui-checkbox:checked").each(function(){
			orderids += $(this).val()+',';
		});
		if(orderids == ''){
			toast.custom({
				title:"请选择订单",
				html:'<i class="aui-iconfont aui-icon-info"></i>',
				duration:2000
			});
			return false;
		}
		orderids = orderids.substr(0, orderids.length-1);
    $api.setStorage('allowance_orderids', orderids);
	}
</script>
<script type="text/javascript">
	$('#start_time').mobiscroll().date({
		theme: 'mobiscroll',
		lang: 'zh',
		dateFormat: 'yyyy-mm-dd',
		display: 'center',
		mode: 'Basic usage date'
	});
	$('#end_time').mobiscroll().date({
		theme: 'mobiscroll',
		lang: 'zh',
		dateFormat: 'yyyy-mm-dd',
		display: 'center',
		mode: 'Basic usage date'
	});
</script>
